<div class="fold color-black">.fold
    <div class="progress empty-m">
        <div class="progress-bar">.fold-form--folded</div>
    </div>
    <button class="fold-trigger--folded color-black">.fold-trigger--folded</button>
    <div class="fold-form fold-form--unfolded empty-m debug">
        <div class="color-black form-fold--status">.form-form--unfolded</div>
    </div>
</div>
<script type="text/javascript" charset="utf-8"">
 document.addEventListener("DOMContentLoaded", () => {
    const $foldForm = $('.fold-form');
    const $foldTrigger = $('.fold-trigger--folded');
    const $progress = $('progress');
    $foldTrigger.on('click', (e) => {
        e.preventDefault();
        e.stopImmediatePropagation();
        $(".progress-bar").toggleClass("progress-start")
        $foldForm.toggleClass('fold-form--folded');
        $foldForm.toggleClass('fold-form--unfolded');
    });
 });
</script>

